<template>
  <div class="user">
    <page-search
      :searchFormConfig="searchFormConfig"
      @resetBtnClick="handleResetClick"
      @queryBtnClick="handleQueryClick"
    ></page-search>
    <page-content
      pageName="users"
      @newBtnClick="handleNewData"
      ref="pageContentRef"
      :contentTableConfig="contentTableConfig"
    ></page-content>
  </div>
</template>
<script lang="ts" setup>
import { ref } from "vue";
import PageSearch from "@/components/Form/PageSearch.vue";
import PageContent from "@/components/Table/PageContent.vue";
import { searchFormConfig } from "./config";
const contentTableConfig: any = {
  title: "用户列表",
  propList: [
    {
      prop: "name",
      label: "用户名",
      minWidth: "80",
    },
    {
      prop: "realname",
      label: "真实姓名",
      minWidth: "80",
    },
    {
      prop: "cellphone",
      label: "手机号码",
      minWidth: "100",
    },
    {
      prop: "enable",
      label: "状态",
      minWidth: "80",
      slotName: "status",
    },
    {
      prop: "createAt",
      label: "创建时间",
      minWidth: "80",
      slotName: "createAt",
    },
    {
      prop: "updateAt",
      label: "更新时间",
      minWidth: "80",
      slotName: "updateAt",
    },
    {
      label: "操作",
      minWidth: "100",
      slotName: "handler",
    },
  ],
  showIndexColumn: true,
  showSelectColumn: true,
};
const pageContentRef = ref<any>();
const handleResetClick = () => {
  console.log("reset");
  pageContentRef.value?.getPageData();
};
const handleQueryClick = (formData: any) => {
  console.log("query", formData);
  pageContentRef.value?.getPageData(formData);
};
const handleNewData = () => {
  console.log("handleNewData");
};
</script>
